<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>function练习</title>
</head>

<body>
  <ul></ul>
  <input type="text" class="ipt1" id="username" />
  <input type="text" class="" id="usernametip" disabled />
  <button>按钮</button>
  <script>
    //函数嵌套
    /*
     * 1、
     * 已知数组 var list = [18,29,32,17,19,30,33,24];
     * (1)要求写一个函数A，一个数组作为参数，该函数返回参数的前6项值。
     * (2)要求写一个函数B，一个数组作为参数，使用函数A处理参数得到新的数组，遍历该数组的值组装到li标签里面，并输出到页面的ul中。
     */
    var list = [18, 29, 32, 17, 19, 30, 33, 24];

    function A(arr) {
      let newArr = arr.slice(0, 6);
      return newArr;
    }

    function B(arr) {
      let str = "";
      arr.forEach((item) => {
        str += `<li>${item}</li>`;
      });
      document.querySelector("ul").innerHTML = str;
    }
    B(A(list));

    /*
     * 2、
     * (1)写一个函数A，该函数能获取一个输入框的值并返回，输入框的id通过参数传入。
     * (2)写一个函数B，该函数能判断一个值不为空、长度是大于4、长度不超过16，均满足返回true，其他情况返回false。
     * (3)点击页面上的按钮，执行函数A获取页面中id为username的输入框的值，将函数A得到的值使用函数B判断，将判断的结果输出到页面id为usernametip的元素中。
     */
    let btn = document.querySelector("button");

    function one(id) {
      return document.querySelector(`#${id}`).value;
    }

    function two(n) {
      if (n.length > 4 && n.length <= 16) {
        return true
      } else {
        return false
      }
    }
    btn.onclick = function () {
      document.querySelector("#usernametip").value = window.two(window.one('username'))
    }
    //递归函数
    /*
     * 1、创建一个递归函数，至少有一个参数a，最终输出a的阶乘。
     */
    let factorial = (n) => {
      if (n == 1) {
        return n;
      } else {
        return n * factorial(n - 1);
      }
    };
    console.log(factorial(5));
    /*
     * 2、创建一个递归函数，有2个参数a,b，最终输出a的b次方的值。
     */
    let cf = (a, b) => {
      if (b == 1) {
        return a;
      } else {
        return a * cf(a, b - 1);
      }
    };
    console.log(cf(2, 4));
    /*
     * 3、创建一个递归函数，至少有一个参数a，最终输出1+2+3+...直到加到a的总和。（注意传入参数异常的处理）
     */
    let addsum = 0;
    let add = (a) => {
      addsum += a;
      if (a == 1) {
        return addsum;
      } else {
        return add(a - 1);
      }
    };
    console.log(add(11));
    //回调函数
    /*
     * 1、创建一个函数A，该函数有三个参数，a,b,c。其中a,b是数字，c是回调函数。
     * 函数A里面求a平方与b平方的和，并运行c函数，将和作为c函数运行的参数。
     * (1)执行函数A，参数：3、4、一个匿名函数，匿名函数中：获取参数，对参数开方，输出开方后的值。
     * (2)执行函数A，参数：5.2、6.3、一个匿名函数，匿名函数中：获取参数，对参数四舍五入，输出四舍五入后的值。
     */

    let last = (a, b, c) => {
      return c(a * a + b * b);
    };
    let er = function (n) {
      return Math.pow(n, 2);
    };
    let san = function (m) {
      return Math.round(m)
    }
    console.log(last(3, 4, er))
    console.log(last(5.2, 6.3, san))
  </script>
</body>

</html>